Firebase Cloud Messaging (FCM) হলো Google এর একটি পরিষেবা যা ডেভেলপারদের তাদের মোবাইল অ্যাপ্লিকেশন বা ওয়েব অ্যাপ্লিকেশনকে পুশ নোটিফিকেশন পাঠানোর সুবিধা প্রদান করে। এটি মোবাইল অ্যাপ্লিকেশন এবং ওয়েব ব্রাউজারদের মধ্যে রিয়েল-টাইম নোটিফিকেশন পাঠানোর জন্য ব্যবহৃত হয়। FCM এর মাধ্যমে, ডেভেলপাররা ডিভাইসে নোটিফিকেশন পাঠাতে পারেন, এমনকি অ্যাপ্লিকেশনটি ব্যাকগ্রাউন্ড বা বন্ধ অবস্থায় থাকলেও।
FCM দিয়ে Push Notification পাঠানোর প্রক্রিয়া
১. Firebase Project তৈরি করা
- Firebase Console এ যান: Firebase Console.
- একটি নতুন প্রকল্প (Project) তৈরি করুন বা পূর্ববর্তী প্রকল্পটি নির্বাচন করুন।
- "Cloud Messaging" সেকশন খুঁজে নিন এবং Firebase Cloud Messaging এ ক্লিক করুন।
- এখানে, আপনার অ্যাপের Server Key এবং Sender ID পাবেন। এগুলি আপনার API রিকোয়েস্টে ব্যবহার করা হবে।
২. React Native অ্যাপে Firebase Integration
Firebase Cloud Messaging (FCM) ব্যবহার করতে, প্রথমে React Native অ্যাপে Firebase সেটআপ করতে হবে। React Native Firebase লাইব্রেরি ব্যবহার করে Firebase পরিষেবা সমূহ যুক্ত করা যায়।
১. React Native Firebase Install করা
প্রথমে, @react-native-firebase লাইব্রেরিটি ইনস্টল করতে হবে।
npm install @react-native-firebase/app @react-native-firebase/messagingএছাড়া, Firebase সেটআপের জন্য আপনার Android এবং iOS প্রজেক্টে কিছু কনফিগারেশন করতে হবে।
২. Firebase Console এ অ্যাপ রেজিস্টার করা
Firebase Console থেকে অ্যাপের জন্য google-services.json (Android) অথবা GoogleService-Info.plist (iOS) ডাউনলোড করুন এবং যথাযথ ডিরেক্টরিতে কপি করুন।
- Android:
android/app/ডিরেক্টরিতেgoogle-services.jsonফাইলটি রাখতে হবে। - iOS: Xcode প্রজেক্টে
GoogleService-Info.plistফাইলটি অন্তর্ভুক্ত করতে হবে।
৩. FCM সেটআপ এবং নোটিফিকেশন সাবস্ক্রাইব করা
Firebase সেটআপ সম্পূর্ণ করার পর, আপনি পুশ নোটিফিকেশন পাঠানোর জন্য এবং রিসিভ করার জন্য কোড লিখতে পারবেন। নিচে React Native অ্যাপে FCM সেটআপ করার উদাহরণ দেওয়া হলো।
১. FCM Permission চাওয়া
পুশ নোটিফিকেশন পাঠানোর আগে, প্রথমে ডিভাইসের অনুমতি নিতে হবে। Android এবং iOS এর জন্য আলাদা আলাদা কনফিগারেশন প্রয়োজন।
import messaging from '@react-native-firebase/messaging';
const requestUserPermission = async () => {
const authStatus = await messaging().requestPermission();
const enabled =
authStatus === messaging.AuthorizationStatus.AUTHORIZED ||
authStatus === messaging.AuthorizationStatus.PROVISIONAL;
if (enabled) {
console.log('Notification permission granted!');
} else {
console.log('Notification permission denied');
}
};২. FCM Token সংগ্রহ করা
FCM সার্ভিসের মাধ্যমে আপনার অ্যাপ্লিকেশনকে একটি Unique Token দেওয়া হয় যা আপনার অ্যাপে পুশ নোটিফিকেশন পাঠানোর জন্য ব্যবহার হবে।
const getToken = async () => {
const token = await messaging().getToken();
console.log('FCM Token:', token);
};৩. নোটিফিকেশন রিসিভ করা
আপনি যখন অ্যাপ্লিকেশনটি ব্যাকগ্রাউন্ডে বা ফরগ্রাউন্ডে থাকবেন, তখন পুশ নোটিফিকেশন রিসিভ করতে onMessage এবং onNotificationOpenedApp এর মতো হুক ব্যবহার করা যায়।
import { useEffect } from 'react';
import messaging from '@react-native-firebase/messaging';
const App = () => {
useEffect(() => {
// When the app is in the background or closed, and a notification is clicked
messaging().onNotificationOpenedApp(remoteMessage => {
console.log('Notification caused app to open:', remoteMessage.notification);
});
// If the app is opened from a terminated state
messaging()
.getInitialNotification()
.then(remoteMessage => {
if (remoteMessage) {
console.log('Notification caused app to open from terminated state:', remoteMessage.notification);
}
});
// Foreground notification handling
const unsubscribe = messaging().onMessage(async remoteMessage => {
console.log('FCM message received: ', remoteMessage);
});
return unsubscribe; // Cleanup the listener when the component unmounts
}, []);
return (
// Your component JSX
);
};৪. Push Notification পাঠানো
এখন FCM সার্ভারের মাধ্যমে পুশ নোটিফিকেশন পাঠানোর সময় Server Key ব্যবহার করা হবে যা Firebase Console থেকে পাওয়া যায়। আপনি Axios বা অন্যান্য HTTP ক্লায়েন্ট ব্যবহার করে API রিকোয়েস্ট করতে পারেন।
import axios from 'axios';
const sendPushNotification = async (token, message) => {
const serverKey = 'YOUR_SERVER_KEY'; // Firebase Console থেকে প্রাপ্ত Server Key
const url = 'https://fcm.googleapis.com/fcm/send';
const notification = {
to: token, // Device Token
notification: {
title: 'Hello',
body: message,
},
priority: 'high',
};
try {
await axios.post(url, notification, {
headers: {
'Authorization': `key=${serverKey}`,
'Content-Type': 'application/json',
},
});
console.log('Notification sent successfully');
} catch (error) {
console.error('Error sending notification:', error);
}
};এখানে token হলো ডিভাইসের FCM টোকেন এবং message হলো সেই বার্তা যা আপনি পাঠাতে চান। API রিকোয়েস্টে Server Key ব্যবহার করা হয় যা Firebase Console থেকে পাওয়া যায়।
৫. Notificatons Handling on Background
Firebase Cloud Messaging দ্বারা পাঠানো নোটিফিকেশনগুলি অ্যাপ্লিকেশন ব্যাকগ্রাউন্ডে থাকার সময় স্বয়ংক্রিয়ভাবে প্রদর্শিত হবে। আপনি যদি নোটিফিকেশনটি কাস্টমাইজ করতে চান বা হালনাগাদ করতে চান, তবে onNotificationOpenedApp বা onMessage হুক ব্যবহার করতে হবে।
সারাংশ
Firebase Cloud Messaging (FCM) ব্যবহার করে আপনি React Native অ্যাপে পুশ নোটিফিকেশন পাঠাতে এবং গ্রহণ করতে পারবেন। এটি সহজভাবে মোবাইল অ্যাপ্লিকেশনগুলির মধ্যে রিয়েল-টাইম নোটিফিকেশন চালু করার জন্য একটি শক্তিশালী টুল। আপনি Firebase Console থেকে সার্ভার কীগুলি পাবেন এবং React Native Firebase লাইব্রেরি ব্যবহার করে অ্যাপের মধ্যে FCM সেটআপ করতে পারবেন। এর মাধ্যমে আপনি অ্যাপ্লিকেশনের ব্যাকগ্রাউন্ড এবং ফরগ্রাউন্ড উভয় অবস্থাতেই পুশ নোটিফিকেশন পাঠানোর এবং গ্রহণ করার সুবিধা পাবেন।
Read more
